'use strict'
import React from 'react'
import { App, View, ListView } from '../component/index'
import style from './css.css'
const dataSource = [
  { id: 1, text: '12123213' },
  { id: 2, text: '12123213' },
  { id: 3, text: '12123213' },
  { text: '12123213', id: 4 },
  { text: '12123213', id: 5 },
  { text: '12123213', id: 6 },
  { text: '12123213', id: 7 }
//   { text: '12123213', id: 8 },
//   { text: '12123213', id: 9 },
//   { text: '12123213', id: 10 },
//   { text: '12123213', id: 11 },
//   { text: '12123213', id: 12 },
//   { text: '12123213', id: 13 }
]

const dataSource2 = [
  { id: 1, text: 'hfkshfs213' },
  { id: 2, text: '12123213' },
  { id: 3, text: '1fsfs23213' },
  { text: '12123213', id: 4 },
  { text: '12sfsf213', id: 5 },
  { text: '12123213', id: 6 },
  { text: '12fsfsf213', id: 7 }
]

class Item extends React.Component {
  static propTypes = {
    item: PropTypes.object
  }
  render () {
    return <View >{this.props.item.text}</View>
  }
}

class Index extends React.Component {
    state = {
      dataSource: dataSource
    }

    render () {
      return (
        <App noSysScroll={true}>
          <ListView
            className={style.scrollView}
            Item={Item}
            dataSource={this.state.dataSource}
            key="id"
            ItemKey="id"
            topRefresh={(cb) => {
              setTimeout(() => {
                this.setState({
                  dataSource: dataSource2
                })
                cb()
              }, 2000)
            }}
          />
        </App>
      )
    }
}
export default Index
